#{extends '/temp/main.html'/}
<div class="page">
    <header class="bar bar-nav">
        <a href="javascript:history.go(-1);" class="icon icon-left pull-left back"></a>
        <!--<a href="index.html" class="button button-link pull-right"><span class="icon iconfont">&#xe618;</span></a>-->
        <h1 class="title">订单详情</h1>
    </header>
    <section class="content helper_order scroll_y">
        <div id="ip_order_list" class="content infinite-scroll infinite-scroll-bottom" style="margin-bottom: 2.5rem">
            <div class="card0 m5">
                <div class="card-header">
                    <ul>
                        <li><span>商家：</span>
                            <p style="color: #198bec;">欣欣果蔬超市</p></li>
                        <li><span>地址：</span>
                            <p>东港区大孙家村</p></li>
                        <li><span>订单：</span>
                            <p>2016071425</p></li>
                        <li><span>日期：</span>
                            <p>2016-07-14 14:25</p></li>
                    </ul>
                </div>
                <div class="card-content">
                    <ul>
                        <li>
                            <div class="cr">
                                <p><span>提成比例：5%</span></p>
                                <p><span>提成金额：<em>￥5.0</em></p>
                            </div>
                            <a href="#"><img src="/public/img/p1.jpg"></a>
                            <h3>新鲜茭白莒县特产</h3>
                            <p><span>500g/捆X2</span><em>￥2.5</em></p>
                        </li>
                        <li>
                            <div class="cr">
                                <p><span>提成比例：5%</span></p>
                                <p><span>提成金额：<em>￥5.0</em></p>
                            </div>
                            <a href="#"><img src="/public/img/p2.jpg"></a>
                            <h3>新鲜茭白莒县特产</h3>
                            <p><span>500g/捆X2</span><em>￥2.5</em></p>
                        </li>
                    </ul>
                </div>
                <div class="card-footer">
                    <div class="pull-left"><p>总价：<i>￥35.60</i></p></div>
                    <div class="pull-right">
                        <p>提成合计：<i>￥8.5</i></p>
                    </div>
                </div>
            </div>
        </div>

    </section>
#{include '/temp/orderListTemp.html'/}
#{include '/temp/bottom.html'/}
</div>

<script>
    var page_num = 1;
    var isLoading = false;

    $(function () {
        $.init();
        loadOrderList(0);

    });
    $(document).on('infinite', '.infinite-scroll-bottom', function () {
        console.log(isLoading);
        if (!isLoading) {
            loadOrderList(1);
            isLoading = true;
        }
    });


    //加载任务列表 loadFirst == 0 ：第一次加载 ，loadFirst > 0 ：第二次及以上加载 ，
    function loadOrderList(loadFirst) {
        if(isLoading) return ; // 如果正在加载，则退出
        isLoading = true ;
        $.showPreloader();
        $.getJSON('/personal/loadOrderList', {pageNum: page_num , pageSize:5 }, function (data) {
            console.log(data);
            if (data.orderList.length == 0) $.detachInfiniteScroll($('.infinite-scroll'));
            else $.attachInfiniteScroll($('.infinite-scroll'));
            if (data.success) {
                page_num = parseInt(page_num)+ 1;
                // console.log('page_num:',page_num);
                var gettpl = document.getElementById('current_date_order_list_tpl').innerHTML;
                laytpl(gettpl).render(data, function (html) {
                    // console.log('data :',data);
                    // console.log('loadFirst :',loadFirst);
                    if (loadFirst == 0) {
                        document.getElementById('ip_order_list').innerHTML = html;
                        $("#ip_order_list").scrollTop(0);
                        loadFirst = 1 ;
                        // return false;
                    } else
                        $('#ip_order_list').append(html);
                    setTimeout(function () {
                        $.hidePreloader();
                    }, 300);
                    $.refreshScroller();
                });
            }

            isLoading = false;

        })

    }
</script>

